// 波点图
@mixin polka($size, $dot, $base, $accent) {
    background: $base;
    background-image: radial-gradient($accent $dot, transparent 0), radial-gradient($accent $dot, transparent 0);
    background-size: $size $size;
    background-position: 0 0, $size/2 $size/2;
}

// @mixin要在@include调用前声明
// 如果@mixin声明包含参数,则@include调用也必须传参,否则会报错
// 以后在创建波点图案时，我们就可以像这样调用它：
div {
    @include polka(30px, 30%, #655, tan);
}

// 棋盘
@mixin checkerboard($size, $base, $accent: rgba(0, 0, 0, .25)) {
    background: $base;
    background-image: linear-gradient(45deg, $accent 25%, transparent 0, transparent 75%, $accent 0), linear-gradient(45deg, $accent 25%, transparent 0, transparent 75%, $accent 0);
    background-position: 0 0, $size $size;
    background-size: 2*$size 2*$size;
}


/* 调用时是这样的…… */

.div2 {
    @include checkerboard(15px, #58a, tan);
}